<template>
  <div>
    <BasicTable
      @register="registerTable"
      size="small"
      title="危险源辨识/上报隐患确认"
      :pagination="false"
      :scroll="{ x: false, y: 'calc(100vh - 320px)' }"
      :key="mode"
    >
      <template #title="{ column, record }">
        <span @click="onConfirmButtonClick(record)">{{ record.title }}</span>
      </template>
      <template #identificationresult="{ column, record }">
        <Tag
          v-if="record.identificationresult !== null && record.identificationresult !== undefined"
          :color="
            identifyOptions.filter((item) => item.value == record.identificationresult)[0]?.color
          "
        >
          {{
            identifyOptions.filter((item) => item.value == record.identificationresult)[0]?.text
          }}</Tag
        >
        <span v-else></span>
      </template>
      <template #ismajor="{ column, record }">
        <div v-if="record.ismajor !== undefined">
          <a-tag v-if="record.ismajor == true" color="#cd201f">重大</a-tag>
          <a-tag v-else-if="record.ismajor == false" color="#3b5999">一般</a-tag>
        </div>
      </template>
      <template #confirmresult="{ column, record }">
        <Tag
          v-if="record.confirmresult !== null && record.confirmresult !== undefined"
          :color="identifyOptions.filter((item) => item.value == record.confirmresult)[0]?.color"
        >
          {{ identifyOptions.filter((item) => item.value == record.confirmresult)[0]?.text }}</Tag
        >
        <span v-else></span>
      </template>
      <template #action="{ column, record }">
        <TableAction
          :actions="[
            {
              label: '确认',
              onClick: onConfirmButtonClick.bind(null, record),
            },
          ]"
        />
      </template>
    </BasicTable>
    <IdentifyConfirmModal @register="registerConfirmModal" mode="confirm" @success="afterSuccess" />
  </div>
</template>

<script lang="ts">
  import { defineComponent, ref, onMounted, nextTick, h, computed } from 'vue';
  import { BasicTable, useTable, TableAction } from '/@/components/Table';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { confirmRecordColumns, queryConfirmRecordSchema } from './hazard.data';
  const { createMessage } = useMessage();
  import { QcUnifyTransToChildProps } from '/#/QcUnify';
  import { OperationTypeEnum } from '/@/enums/appEnum';
  import { useModal } from '/@/components/Modal';
  import { queryConfirmIdentifyRecord, confirmIdentifyRecord } from '/@/api/ehs/hazard';
  import { useDrawer } from '/@/components/Drawer';
  import { useRouter } from 'vue-router';
  import { Tag } from 'ant-design-vue';
  import { queryUnitDivision } from '/@/api/ehs/unitDivision';
  import { Icon } from '/@/components/Icon';
  import { queryEnumOptions } from '/@/api/platform/enum';
  import UnitBasicInfoDrawer from '../unitDivision/UnitBasicInfoDrawer.vue';
  import { useGlobSetting } from '/@/hooks/setting';
  import { getUserOrganization } from '/@/api/ehs/organization';
  import IdentifyConfirmModal from './IdentifyConfirmModal.vue';
  import moment from 'moment';
  const { globalProjectCode } = useGlobSetting();
  export default defineComponent({
    name: 'HazardConfirmRecord',
    components: {
      BasicTable,
      TableAction,
      Tag,
      Icon,
      UnitBasicInfoDrawer,
      IdentifyConfirmModal,
    },
    props: ['mode'],
    setup(props, {}) {
      const projectCode = ref<String>(globalProjectCode);
      const organizationCode = ref();
      const router = useRouter();
      const identifyOptions = ref();
      const [registerConfirmModal, { openModal: openConfirmRecordModal }] = useModal();
      const [registerTable, { reload, getForm }] = useTable({
        api: queryConfirmIdentifyRecord,
        immediate: false,
        columns: confirmRecordColumns,
        canResize: true,
        showTableSetting: true,
        tableSetting: {
          redo: false,
        },
        useSearchForm: true,
        formConfig: {
          fieldMapToTime: [['tm', ['begintm', 'endtm'], 'YYYY-MM-DD']],
          labelWidth: 60,
          schemas: queryConfirmRecordSchema,
        },
        beforeFetch: (params) => {
          params.orgcode = organizationCode.value;
        },
        striped: false,
        showIndexColumn: true,
        bordered: true,
        ellipsis: true,
        indentSize: 15,
        actionColumn: {
          width: 80,
          title: '操作',
          dataIndex: 'action',
          slots: { customRender: 'action' },
          fixed: 'right', //表格操作列是否固定，不设置时默认固定在右侧
        },
      });

      function onConfirmButtonClick(record) {
        let propsData: QcUnifyTransToChildProps = {
          moduleName: '危险源辨识/上报隐患确认',
          operateString: '确认',
          dataId: record.identifyid,
          hazardid: record.hazardid,
          unitid: record.unitid,
          confirmresult:
            record.confirmresult >= 0 ? record.confirmresult : record.identificationresult,
          categorycode: record.categorycode,
          projectcode: record.projectcode,
          itemcode: record.itemcode,
        };
        openConfirmRecordModal(true, propsData);
      }

      function afterSuccess() {
        reload();
      }

      onMounted(() => {
        //  获取枚举类
        queryEnumOptions('EhsHazardIndentificationResultTypeEnum')
          .then((res) => {
            // console.log('option res', res);
            if (res != undefined && res != null && res.length > 0x0) {
              const identifyOp = res[0].options.map((option) => {
                return {
                  value: option.key,
                  text: option.value,
                  color: option.attribute.split('"')[3],
                };
              });
              identifyOptions.value = identifyOp;
            }
          })
          .catch((ex) => {
            console.log('catch ', ex);
          });
        getUserOrganization(projectCode.value).then((res) => {
          // 请求时需要传入用户的组织编码
          organizationCode.value = res?.orgcode;
          queryUnitDivision({
            includechilds: true,
            isdept: false,
            flagisvalid: false,
            orgcode: res.orgcode,
          }).then((res) => {
            getForm().updateSchema({
              field: 'unitid',
              componentProps: {
                getPopupContainer: (triggerNode) => document.body,
                treeData: res,
                fieldNames: { label: 'unitname', value: 'unitid', children: 'children' },
                listHeight: 150,
                treeDefaultExpandAll: true, //默认展开
                showCheckedStrategy: 'SHOW_ALL', //定义选中项回填的方式:默认只显示子节点;SHOW_ALL:显示所有选中节点(包括父节点);SHOW_PARENT:只显示父节点(当父节点下所有子节点都选中时).
              },
            });
          });
          reload();
        });
      });
      return {
        moment,
        organizationCode,
        registerConfirmModal,
        registerTable,
        router,
        afterSuccess,
        onConfirmButtonClick,
        identifyOptions,
        registerConfirmModal,
      };
    },
  });
</script>

<style scoped>
  a {
    color: #000;
  }
</style>
